<template>
  <el-row :gutter="0">
    <el-col :span="column.span == '12' ? 12 - Number(Boolean(column.unit)) : 16 - Number(Boolean(column.unit))">
      <el-tooltip class="item" effect="dark" :content="query[column.prop[0]]" placement="top">
        <el-form-item :label="column.name" :prop="column.prop[0]">
          <InputNumber
            style="width: 100%"
            :max="column.max"
            :min="column.min"
            v-model="query[column.prop[0]]"
            :precision="column.precision"
            :clearable="column.clearable"
            placeholder="请输入"
          ></InputNumber>
        </el-form-item>
      </el-tooltip>
    </el-col>
    <el-col :span="1" style="text-align: center; line-height: 32px">-</el-col>
    <el-col :span="column.span == '12' ? 11 - Number(Boolean(column.unit)) : 7 - Number(Boolean(column.unit))">
      <el-tooltip class="item" effect="dark" :content="query[column.prop[1]]" placement="top">
        <el-form-item label-width="0px" :prop="column.prop[1]">
          <InputNumber
            style="width: 100%"
            :max="column.max"
            :min="column.min"
            v-model="query[column.prop[1]]"
            :precision="column.precision"
            :clearable="column.clearable"
            placeholder="请输入"
          ></InputNumber>
        </el-form-item>
      </el-tooltip>
    </el-col>
    <el-col v-if="column.unit" :span="2" style="text-align: center; line-height: 32px; font-size: 12px; color: #666"
      >{{ column.unit }}
    </el-col>
  </el-row>
</template>

<script>
export default {
  name: 'InputRange',
  props: {
    query: {
      type: Object,
      default: () => {},
    },
    column: {
      type: Object,
      default: () => {},
    },
  },
};
</script>

<style lang="scss" scoped></style>
